import wepy from 'wepy'

// 存在的问题 :
// 1-触发onSearch事件时,没有搜索建议列表时,页面不能跳转(已解决)
// 2-点击tag标签时,调用一次获取建议搜索列表,当没有建议搜索列表时,页面不能跳转(已解决)
// 3-触发了页面跳转后,再返回search页面时,应该清空输入框以及搜索建议列表(已解决)

export default class extends wepy.mixin {
  data = {
    // 搜索框中的默认内容
    value: '',
    // 搜索建议列表
    suggestList: [],
    // 搜索历史列表
    kwList: []
  }

  onLoad() {
    const kwList = wx.getStorageSync('kw') || []
    this.kwList = kwList
  }

  onShow() {
    // setTabBarBadge只有在tabbar页面调用才能生效,此处需调用一次该函数
    this.$parent.renderCartBadge()
  }

  // 当跳转到搜索页面时,清空输入框以及搜索建议列表
  onHide() {
    this.value = ''
    this.suggestList = []
    this.$apply()
  }

  methods = {
    // 当搜索关键词发生变化，会触发这个事件处理函数
    onChange(e) {
      this.value = e.detail.trim()
      if (e.detail.trim().length <= 0) {
        this.suggestList = []
        return
      }
      setTimeout(() => {
        this.getSuggestList(e.detail)
      }, 500)
    },

    // 回车搜索触发
    onSearch(e) {
      // 判断是否输入关键字
      const kw = e.detail.trim()
      if (kw.length === 0) {
        return
      }
      // 将搜索关键词，保存到 Storage 中
      if (this.kwList.indexOf(kw) === -1) {
        this.kwList.unshift(kw)
      }
      // 只保留10条记录
      this.kwList = this.kwList.slice(0, 10)
      wepy.setStorageSync('kw', this.kwList)
      // 异步判断建议搜索列表是否为空
      setTimeout(() => {
        if (this.suggestList.length === 0) {
          wepy.baseToast('暂无该类商品!')
        } else {
          wepy.navigateTo({
            url: '/pages/goods_list?query=' + kw
          })
        }
      }, 500)
    },

    // 点击取消
    onCancel() {
      this.suggestList = []
    },

    // 点击搜索建议项，导航到商品详情页面
    goGoodsDetail(goodsId) {
      wepy.navigateTo({
        url: '/pages/goods_detail?goods_id=' + goodsId
      })
    },

    // 点击每个Tag标签，导航到商品列表页面，同时把参数传递过去
    goGoodsList(kw) {
      this.getSuggestList(kw)
      // 异步判断建议搜索列表是否为空
      setTimeout(() => {
        if (this.suggestList.length === 0) {
          wepy.baseToast('暂无该类商品!')
        } else {
          wepy.navigateTo({
            url: '/pages/goods_list?query=' + kw
          })
        }
      }, 500)
    },

    // 清除搜索历史记录
    clearHistory() {
      this.kwList = []
      wepy.setStorageSync('kw', [])
    }
  }

  // 计算属性
  computed = {
    // true 展示搜索历史区域
    // false 展示搜索建议区域
    isShowHistory() {
      if (this.value.length <= 0) {
        return true
      }
      return false
    }
  }

  // 获取搜索建议列表
  async getSuggestList(searchStr) {
    const { data: res } = await wepy.get('/goods/qsearch', { query: searchStr })
    if (res.meta.status !== 200) {
      return wepy.baseToast()
    }
    this.suggestList = res.message
    this.$apply()
  }
}
